<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="ec" uri="http://www.ecside.org" %>

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>场馆定位</title>
		<link href="http://code.google.com/apis/maps/documentation/javascript/examples/standard.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
		<script type="text/javascript">
			var geocoder;
			var map;
			function initialize() {
				geocoder = new google.maps.Geocoder();
				var latlng = new google.maps.LatLng(30.658601,104.064856);
				var myOptions = {
					zoom: 16,
					center: latlng,
					mapTypeId: google.maps.MapTypeId.ROADMAP
				};
				map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
			}
			
			
			function codeAddress() {
				var address = document.getElementById("address").value;
				geocoder.geocode( { 'address': address}, function(results, status) {
					if (status == google.maps.GeocoderStatus.OK) {
						var latlng = results[0].geometry.location;
						document.getElementById("lat").value = figRound(latlng.lat(),6);
						document.getElementById("lng").value = figRound(latlng.lng(),6);
						document.getElementById("latlng").value = figRound(latlng.lat(),6) + "," + figRound(latlng.lng(),6);
						map.setCenter(latlng);
						var marker = new google.maps.Marker({
						    map: map, 
						    position: latlng
						});
					} else {
						alert("获取经纬度失败: " + status);
					}
				});
			}
			
			//四舍五入
			function figRound(Dight,How){
				return Math.round(Dight*Math.pow(10,How))/Math.pow(10,How);
            }
		</script>
	</head>
	<body onload="initialize()">
		<div>
			请输入地址：<input id="address" type="text" style="width: 300" value="中国成都">
			<input type="button" value="获取经纬度" onclick="codeAddress()">
			<input id="latlng" type="text" style="width: 150" value="">
			<input id="lat" type="hidden" value="">
			<input id="lng" type="hidden" value="">
		</div>
		<div id="map_canvas" style="height:90%"></div>
	</body>
</html>